<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/bootstrap.min.css">
    <link rel="stylesheet" href="./css/fontawesome/css/all.min.css">
    <script src="./css/fontawesome/js/all.min.js"></script>
</head>

<body>

    <div class="alert alert-danger" role="alert">
        用户名或密码错误！
    </div>

    <div class="card mt-5" style="width: 400px; margin-left: auto; margin-right: auto;">
        <div class="card-header">
            <h2>登录</h2>
        </div>
        <div class="card-body">
            <form name="loginForm">
                <div class="mb-3">
                    <label class="form-label">用户名</label>
                    <input type="text" class="form-control" name="username">
                </div>
                <div class="mb-3">
                    <label class="form-label">密码</label>
                    <input type="password" class="form-control" name="password">
                </div>

                <div>
                    <button type="button" class="btn btn-primary" data-action="submit">提交</button>
                </div>

            </form>
        </div>
    </div>
    <script type="module">

        import PocketBase from './js/pocketbase.es.js';
        import _on from './js/_on.js';

        const pb = new PocketBase('http://127.0.0.1:8090');

        // 判断是否登录
        if (pb.authStore.token !== '') {
            // 未登录，跳转登录界面
            location.href = './index.html';
        }

        // 获取表单对象
        const loginForm = document.loginForm;

        _on('click', {
            async submit() {
                const username = loginForm.username.value;//用户名
                const password = loginForm.password.value;// 密码
                // 登录
                try {
                    await pb.collection('users').authWithPassword(
                        username,
                        password,
                    );

                    // 设置地址栏, 跳转
                    location.href = './index.html';
                    // console.log('登录成功');
                } catch (error) {
                    console.dir('登录失败');
                }

            }
        });



    </script>

</body>

</html>